{extend name="../../public/admin"}
{block name="title"}数据字典{/block}
{block name="css"}
<link rel="stylesheet" href="__PUBLIC__/admin/css/index.dictionaries.css">
{/block}
{block name="body"}
<div id="container">
    <div class="col-xs-6 col-xs-offset-3">

    </div>

    <div class="clearfix"></div>
    <div style="height: 20px;"></div>
    <div class="table-responsive" id="header">
        <table class="table table-bordered table-hover" v-cloak>
           <thead>
               <tr class="active">
                   <th colspan="7" class="text-left">
                       <a href="javascript:;" @click="addData()" class="btn btn-info btn-sm"><i class="fa fa-plus"></i> {:lang('添加')}</a>
                       <span class="fa-pull-right">总 <strong>{{list.length}}</strong> 条</span>
                   </th>
               </tr>
               <tr class="active">
                   <th width="5%">编号</th>
                   <th width="10%">编码</th>
                   <th width="10%">名称</th>
                   <th width="20%">备注</th>
                   <th width="20%">创建时间</th>
                   <th width="30%">用途</th>
                   <th width="5%" class="text-center">操做</th>
               </tr>
           </thead>
            <tbody>
                <tr v-for="(key,index) in list">
                    <td>{{index+1}}</td>
                    <td><input type="text" v-model="key.code" @change="up('code',key.code,key.id)"></td>
                    <td><input type="text" v-model="key.name" @change="up('name',key.name,key.id)"></td>
                    <td><input type="text" v-model="key.memo" @change="up('memo',key.memo,key.id)"></td>
                    <td>{{key.addtime}}</td>
                    <td><input type="text" v-model="key.title"  @change="up('title',key.title,key.id)"></td>
                    <td class="text-center">
                        <a href="javascript:;" @click="de(key.id,index)" class="btn btn-xs" title="删除"><i class="fa fa-trash-o"></i></a>
                    </td>
                </tr>
            </tbody>

        </table>
        <div class="alert">
            <h5>书写规范提示：</h5>
            开头两位数，代表类表。
        </div>
    </div>
</div>
{/block}
{block name="js"}
<script>
    var app = new Vue({
        el:'#header',
        data:{
            list:[]
        }
    });
    get_data();
    //获取数据
    function get_data() {
        $.get(DINDEX+'/dictionaries.html',function (da) {
            app.list = da;
        });
    }

    //内容改变事件
    app.up = (name,val,id)=>{
        $.post(DINDEX+'/up_dictionaries',{name:name,val:val,id:id},function (da) {
            if(da){
                layer.msg('修改成功',{icon:1,offset:'rb'});
            }
            else {
                layer.msg('修改失败',{icon:2,offset:'rb'});
                get_data();
            }
        });
    }

    //删除内容
    app.de = (id,index)=>{

        var queren = layer.confirm('确定要删除',{icon:0},function () {
            layer.close(queren);
            app.list.splice(index,1);
            $.post(DINDEX+'/de_dictionaries',{id:id},function (da) {
                if(da){
                    layer.msg('删除成功',{icon:1,offset:'rb'});
                }
                else {
                    layer.msg('删除失败',{icon:2,offset:'rb'});
                    get_data();
                }
            });
        });

    }

    //添加内容
    app.addData=()=>{
        yeMian(DINDEX+'/add_dictionaries',function () {
            get_data();
        });
    }
</script>
{/block}